<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>申请退差价</title>
    <link rel="stylesheet" type="text/css" href="../../../css/aui/aui.css" />
    <style>
        body {
            background: #fff;
        }

        .textarea {
            width: 100%;
            height: 6rem;
            border: 1px solid #E1E1E1;
            padding: 0.2rem;
        }

        .btn {
            background: #0689FB;
            width: 100%;
            height: 2rem;
            text-align: center;
            line-height: 2rem;
            color: #fff;
            margin: 6rem auto 3rem;
            border-radius: 0.2rem;
        }

        .tuikuan {
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-bottom: 1px solid #E1E1E1;
            margin-top: 1rem;
        }

        .beizhu {
            margin-top: 0.5rem;
            color: #0689FB;
            font-size: 0.7rem;
        }
    </style>
</head>

<body>
    <div id="app">
        <div class="aui-content-padded">
            <div class="aui-margin-b-10">申请原因</div>
            <textarea name="" id="" class="textarea" v-model="refund_notes" placeholder="请详细描述申请退差价的理由"></textarea>

            <div class="tuikuan">
                <div class="aui-list-item-label">退款金额（元）</div>
                <div class="aui-list-item-input">
                    <input type="number" v-model="refund_price" placeholder="请输入金额" style="text-align:right;font-size:0.6rem;">
                </div>
            </div>
            <div class="beizhu"><small>备注：申请退款的金额不得超过项目金额的20%；</small></div>
            <div class="btn" @click="submit()">立即提交</div>
        </div>
    </div>
</body>
<script src="../../../script/api.js" charset="utf-8"></script>
<script src="../../../script/aui/aui-tab.js" charset="utf-8"></script>
<script src="../../../script/common/jquery-3.3.1.min.js" charset="utf-8"></script>
<script src="../../../script/common/check.js" charset="utf-8"></script>
<script src="../../../script/common/common.js" charset="utf-8"></script>
<script src="../../../script/common/config.js" charset="utf-8"></script>
<script src="../../../script/common/vue.min.js" charset="utf-8"></script>
<script>
    apiready = function() {
        api.parseTapmode();
        vm.init();
    }

    var vm = new Vue({
        el: "#app",
        data: {
            orderInfo: {},
            refund_price: '',
            refund_notes: ''

        },
        methods: {
            init() {
                this.orderInfo = api.pageParam;
            },
            submit() {
                var that = this;
                if (!is_define(this.refund_price)) {
                    $toast("请填写退款金额");
                    return;
                } else if ((this.refund_price * 100).toString().indexOf('.') != -1) {
                    $toast('只能精确到分');
                    return;
                } else if (parseInt(((this.refund_price * 100) / (this.orderInfo.order_price * 100)) * 100) > 20) {
                    $toast('金额不得超过项目金额的20%');
                    return;
                } else if (!is_define(this.refund_notes)) {
                    $toast("请填写申请原因");
                    return;
                }
                var data = {
                    order_id: api.pageParam.order_id,
                    work_id: api.pageParam.work_id,
                    work_user_id: api.pageParam.work_user_id,
                    accept_user_id: api.pageParam.accept_user_id,
                    refund_price: this.refund_price,
                    refund_notes: this.refund_notes,
                };
                _ajax(Config.api.WorkUserApplyRefund, data, function(ret) {
                    if (ret.code === 200) {
                        $toast("提交成功");
                        setTimeout(function() {
                            close_w();
                        }, 1000);
                    } else {
                        $toast(ret.msgs);
                    }
                });
            },
            getPercent(num, total) {
                num = parseFloat(num);
                total = parseFloat(total);
                if (isNaN(num) || isNaN(total)) {
                    return "-";
                }
                return total <= 0 ? 0 : (Math.round(num / total * 10000) / 100.00);
            }
        }
    });
</script>

</html>
